<!-- 应用信息 -->
<template>
    <div class="vue-box submit-box--dialog" style="width: 600px;">
        <!-- ------- 内容部分 ------- -->
        <div class="c-card">
            <el-form label-width="12em">
                <show-info name="应用 id：">{{ state.model.id }}</show-info>
                <show-info name="应用编号：">{{ state.model.sn }}</show-info>
                <show-info name="应用名称：">{{ state.model.name }}</show-info>
                <show-info name="应用图标：" :value="state.model.logo" type="img"></show-info>
                <show-info name="应用介绍：">{{ state.model.intro }}</show-info>
                <show-info name="单独秘钥：" style="color: #E6A23C;"><b>{{ sa.isNull(state.model.aloneKey, '未配置') }}</b></show-info>
                <show-info name="主页地址：">{{ state.model.homeUrl }}</show-info>
                <show-list name="允许授权的url：" :value="state.model.allowUrl" type="text-list"></show-list>
                <show-info name="一键登录地址：">{{ state.model.autoLoginUrl }}</show-info>
                <show-enum name="应用状态：" :value="state.model.status" :jv="{1: '启用', 2: '禁用'}"></show-enum>
                <show-enum name="是否公开：" :value="state.model.isPublic" :jv="{1: '公开应用', 2: '私有应用'}"></show-enum>
                <show-info name="创建时间：">{{ sa.forDate(state.model.createTime, 2) }}</show-info>
            </el-form>
        </div>
    </div>
</template>

<script setup name="sp-client-info">
import {onMounted} from "vue";

// 获取插值 
const prop = defineProps({
    param: {type: Object}
})

// ------------------ 数据 ------------------
const state = reactive({
    id: prop.param.id || 0,  // 获取传值id （0=添加，非0=修改）
    model: {},    // 数据 Model
})

// 组件加载时触发
onMounted(() => {
    f5();
})

// ------------------ 函数 ------------------
// 查询 
const f5 = function () {
    sa.ajax('/SysClient/getById?id=' + state.id, function(res) {
        if(res.data == null) {
            return sa.alert('未能查找到 id=' + state.id + " 详细数据");
        }
        state.model = res.data;
    });
}

</script>

<style scoped>

</style>
